.sidebar-offset {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	padding-top: 81px;
	width: 100%;

	@media (min-width: $screen-md) {
		padding-left: 332px;
		padding-top: 0;
	}

	.clay-site-container {
		max-width: 100%;

		@media (min-width: $screen-lg) {
			max-width: calc(100% - 295px);
			margin: 0;
		}
	}
}

.sidenav-sticky.sidenav-menu-slider {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 11;

	.sidenav-menu {
		width: 100%;

		.sidebar-header {
			.sidebar-toggler {
				.lexicon-icon {
					display: none;

					&:first-child {
						display: inline-block;
					}
				}

				@media (min-width: $screen-md) {
					display: none;
				}
			}
		}

		.sidebar-body {
			display: none;

			@media (min-width: $screen-md) {
				display: block;
			}
		}
	}

	&.toggler-expanded {
		height: 100vh;

		.sidenav-menu {
			.sidebar-header {
				.sidebar-toggler {
					.lexicon-icon {
						&:first-child {
							display: none;
						}

						&:last-child {
							display: inline-block;
						}
					}
				}
			}

			.sidebar-body {
				display: block;
			}
		}
	}

	@media (min-width: $screen-md) {
		width: 320px;
		height: 100vh;
		flex-shrink: 0;
	}
}
